<template>
	<view class="workerlist">
        <BaseNavBar :isnormarl="true" title="我要评价" :idx="0"/>
        <view class="desc-title">
			<view class="desc-left">
				<view class="sub-title">
					中信证券  户外安装 门头
				</view>
				<view class="desc-type">
					服务类别：门头安装
				</view>
			</view>
			<view class="price-right">
				500
			</view>
		</view>
		<view class="evaluate-box">
			<view class="two-eval" @click="changeStatus">
			
			</view>
			<text class="words">描述维度：</text>
			<view class="eval-box">
				<view class="eval-item">
					技术精湛
				</view>
				<view class="eval-item">
					技术精湛
				</view>
				<view class="eval-item">
					技术精湛
				</view>
			</view>
			<view class="area-box">
				从多个角度评价，可以帮助更多人真实地了解
				<view class="photo-box">
					发图/视频可以帮助更多人真实地了解
				</view>
			</view>
		</view>
		<view class="save-btn">保存</view>
	</view>
</template>

<script>
	import {
		walletData,
		walletDetails,
		rechargeWallet
	} from '../../api'
    import workerCard from './workerCard'
	export default {
		data() {
			return {
                status: true,
				statusbarHeight: 0,
				amount: 0,
				walletData: [],
				totalPay: 0,
				totalIn: 0,
				isselectGood: true,
			}
		},
        components: {
			workerCard
		},
		mounted() {
			this.statusbarHeight = getApp().globalData.statusBarHeight;
			this.myWallet()
			this.userWelletDetail()
		},
		methods: {
			changeStatus() {
				this.isselectGood = !this.isselectGood
			},
			backHandle() {
				uni.navigateBack();
			},
			// 保留2位小数处理
			priceToFixed(num, digit = 2) {
				let nums = (num || 0).toString().split('.');
				return nums[0] + '.' + (nums[1] || '0').padEnd(digit, "0");
			},
			myWallet() {
				let userId = uni.getStorageSync('userInfo').id
				let data = {
					userId: userId
				}
				walletData(data).then(res => {
					console.log('我的钱包页===', res.data)
					if (res.status == 200) {
						this.walletData = res.data
						this.walletData.forEach(item => {
							if (item.type == '支出') this.totalPay += item.price
							if (item.type == '收入') this.totalIn += item.price
							return (item.price = this.priceToFixed(item.price), this.totalPay, this
								.totalIn)
						})
						this.totalPay = this.priceToFixed(this.totalPay)
						this.totalIn = this.priceToFixed(this.totalIn)
					}
				})
			},
			userWelletDetail() {
				let userId = uni.getStorageSync('userInfo').id
				let data = {
					userId: userId
				}
				walletDetails(data).then(res => {
					console.log('我的钱包详情===', res.data)
					if (res.status == 200) {
						this.amount = this.priceToFixed(res.data.amount)
					}
				})
			},
			//充值
			recharge() {
				//1、获取的code调用后端接口，后端生成一个openId
				let AUTH = uni.getStorageSync("token")
				let data = {
					Authorization: AUTH
				}
				rechargeWallet(data).then(res => {
					if(res.status == 200){
						//2、把openId发送给后端，去调用微信官方的支付接口
						uni.requestPayment({
							provider: 'wxpay', //服务提供商
							appId: res.data.appId,
							timeStamp: res.data.timeStamp, //时间戳，从1970年1月1日00:00:00 至今的秒数，即当前的时间
							nonceStr: res.data.nonceStr, //随机字符串，长度为32个字符以下
							package: res.data.package, //统一下单接口返回的 prepay_id 参数值，提交格式如：prepay_id=***
							signType: res.data.signType, //签名算法，应与后台下单时的值一致
							paySign: res.data.paySign, //签名
							success: (res) => {
								//支付成功的操作
							},
							fail: (err) => {
								// console.log(err);
								uni.showToast({
									icon: 'none',
									title: '支付失败，请重新支付'
								})
							}
						})
					}
				})
				
			}
		}
	}
</script>

<style lang="scss" scoped>
.workerlist {
    width: 100vw;
    height: 100vh;
    background-color: #EFF1F2;
	.desc-title {
		width: 100vw;
		height: 68px;
		box-sizing: border-box;
		background: #FFFFFF;
		border-radius: 8px 8px 8px 8px;
		padding: 11px 46px 0 26px;
		opacity: 1;
		display: flex;
		justify-content: space-between;
		.desc-left {
			.sub-title {
				display: inline-block;
				font-size: 14px;
				font-weight: bold;
				color: #000;
				line-height: 18px;
				letter-spacing: 4px;
				
			}
			.desc-type {
				display: inline-block;
				font-size: 11px;
				font-weight: 500;
				color: #666;
				line-height: 18px;
				letter-spacing: 4px;
				margin-top: 5px;
			}
		}
		.price-right {
			font-size: 12px;
			font-weight: bold;
			color: #EB553F;
			line-height: 18px;
			letter-spacing: 4px;
		}
	}
	.evaluate-box {
		width: 100vw;
		background: #FFFFFF;
		box-sizing: border-box;
		padding-top: 19px;
		margin-top: 8px;
		.two-eval {
			margin-left: 26px;
			width: 320px;
			height: 24px;
			position: relative;
			.eval-card1 {
				position: absolute;
				top: 0;
				left: 0;
				z-index: 1;
				display: inline-block;
				font-size: 14px;
				font-weight: bold;
				color: #D2D2D2;
				width: 172px;
				height: 24px;
				background: #EFF1F2;
				border-radius: 24px 0px 0px 24px;
				text-align: center;
				line-height: 24px;
			}
			.eval-card2 {
				display: inline-block;
				position: absolute;
				top: 0;
				left: 160px;
				z-index: 0;
				width: 172px;
				height: 24px;
				background: #EFF1F2;
				border-radius: 0px 24px 24px 0px;
				font-size: 14px;
				font-weight: bold;
				color: #D2D2D2;
				text-align: center;
				line-height: 24px;
			}
			.selected-style {
				background: #2456E0;
				color: #fff;
				border-radius: 24px 24px 24px 24px;
				z-index: 1;
			}
		}
		.words {
			display: inline-block;
			font-size: 14px;
			font-weight: bold;
			color: #000;
			margin: 15px 26px 8px;
		}
		.eval-box {
			margin-left: 26px;
			.eval-item {
				line-height: 20px;
				font-size: 14px;
				font-weight: bold;
				color: #D2D2D2;
				display: inline-block;
				height: 24px;
				border-radius: 4px 4px 4px 4px;
				opacity: 1;
				border: 3px solid #EFF1F2;
				padding: 3px 7px 1px 7px;
				margin-right: 8px;
			}
		}
	}
}
</style>